import path from 'path'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { splitVendorChunkPlugin } from 'vite'
import viteImagemin from 'vite-plugin-imagemin'
import VitePluginCompression from 'vite-plugin-compression'
import { visualizer } from 'rollup-plugin-visualizer'

// https://vitejs.dev/config/
export default defineConfig({
  // 插件配置
  plugins: [
    vue(),
    // 分包插件，将第三方库代码单独打包
    splitVendorChunkPlugin(),
    // 图片压缩
    viteImagemin(),
    VitePluginCompression({
      verbose: true, // 输出压缩结果
      threshold: 10240, // 10KB以上才压缩
      algorithm: 'gzip'
    }),
    visualizer({
      open: true,
      gzipSize: true,
      brotliSize: true,
    })
  ],

  // 路径别名配置
  resolve: {
    alias: {
      '@': path.resolve(__dirname, 'src'),
    },
    // 文件扩展名自动解析
    extensions: ['.js', '.vue', '.json', '.ts']
  },

  // 开发服务器配置
  server: {
    proxy: {
      '/api': {
        target: 'http://127.0.0.1:3000/',
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, '')
      },
    },
    // 开发服务器配置
    host: '0.0.0.0',
    port: 5173,
    open: true,
    cors: true
  },

  // 构建配置
  build: {
    // 输出目录
    outDir: "online",
    // 静态资源目录
    assetsDir: 'assets',
    // 小于此阈值的导入或引用资源将内联为 base64 编码
    assetsInlineLimit: 4096,
    // 启用/禁用 CSS 代码拆分
    cssCodeSplit: true,
    // 构建后是否生成 source map 文件
    sourcemap: false,
    // 自定义底层的 Rollup 打包配置
    rollupOptions: {
      output: {
        // 分包策略
        manualChunks: (id) => {
          // 将 three.js 相关代码单独打包
          if (id.includes('node_modules/three')) {
            return 'three';
          }
          
          // 将 node_modules 中的代码进行更细致的分包
          if (id.includes('node_modules')) {
            // Vue 相关包
            if (id.includes('node_modules/vue') || 
                id.includes('node_modules/@vue')) {
              return 'vendor-vue';
            }
            // Vue Router
            if (id.includes('node_modules/vue-router')) {
              return 'vendor-router';
            }
            // Pinia
            if (id.includes('node_modules/pinia')) {
              return 'vendor-pinia';
            }
            // Axios
            if (id.includes('node_modules/axios')) {
              return 'vendor-axios';
            }
            // Lodash
            if (id.includes('node_modules/lodash')) {
              return 'vendor-lodash';
            }
            // Element Plus
            if (id.includes('node_modules/element-plus')) {
              return 'vendor-element';
            }
            // ECharts
            if (id.includes('node_modules/echarts')) {
              return 'vendor-echarts';
            }
            // 其他第三方库
            return 'vendor-others';
          }

          // 将大型组件单独打包
          if (id.includes('src/components/Echart')) {
            return 'echarts';
          }
          if (id.includes('src/components/Box')) {
            return 'box';
          }
          // 其他组件打包在一起
          if (id.includes('src/components')) {
            return 'components';
          }
        },
        // 用于从入口点创建的块的打包输出格式[name]表示文件名,[hash]表示该文件内容hash值
        chunkFileNames: 'assets/js/[name]-[hash].js',
        // 用于命名代码拆分时创建的共享块的输出命名
        entryFileNames: 'assets/js/[name]-[hash].js',
        // 用于输出静态资源的命名，[ext]表示文件扩展名
        assetFileNames: 'assets/[ext]/[name]-[hash].[ext]'
      }
    },
    // 压缩配置
    minify: 'terser',
    terserOptions: {
      compress: {
        // 生产环境去除 console
        drop_console: true,
        // 生产环境去除 debugger
        drop_debugger: true,
        // 移除未使用的代码
        dead_code: true,
        // 移除未使用的变量
        unused: true,
        // 移除未使用的函数参数
        arguments: true,
        // 移除未使用的属性
        properties: true,
        // 移除未使用的函数
        pure_funcs: ['console.log', 'console.info', 'console.debug', 'console.warn'],
        // 移除未使用的全局变量
        global_defs: {
          'process.env.NODE_ENV': '"production"'
        },
        // 优化 if 语句
        if_return: true,
        // 优化表达式
        evaluate: true,
        // 优化布尔值
        booleans: true,
        // 优化循环
        loops: true,
        // 优化条件表达式
        conditionals: true,
        // 优化连续变量声明
        sequences: true,
        // 优化连续表达式
        join_vars: true,
        // 优化连续语句
        collapse_vars: true,
        // 优化连续函数
        reduce_funcs: true,
        // 优化连续对象
        reduce_vars: true,
        // 优化连续数组
        passes: 3
      },
      mangle: {
        // 混淆变量名
        toplevel: true,
        // 混淆属性名
        properties: {
          // 保留特定的属性名
          reserved: ['$', 'jQuery', 'Vue', 'React', 'Component', 'Prop', 'Watch', 'Computed'],
          // 混淆所有属性名
          regex: /^_/
        }
      },
      format: {
        // 移除注释
        comments: false,
        // 美化输出
        beautify: false,
        // 移除分号
        semicolons: true,
        // 移除空格
        ascii_only: true
      }
    },
    // 启用构建优化
    target: 'es2015',
    // 启用 tree-shaking
    treeshake: {
      // 启用更激进的 tree-shaking
      moduleSideEffects: false,
      // 移除未使用的导出
      propertyReadSideEffects: false,
      // 尝试移除未使用的代码
      tryCatchDeoptimization: false
    },
    // 启用 gzip 压缩
    reportCompressedSize: true,
    // 规定触发警告的 chunk 大小
    chunkSizeWarningLimit: 2000
  },

  // CSS 相关配置
  css: {
    // 是否开启 CSS 的 source map
    devSourcemap: false,
    // 配置 CSS modules
    modules: {
      // 自定义生成的类名
      generateScopedName: '[name]__[local]___[hash:base64:5]'
    }
  }
})
